<!--用户信息-->
<template>
  <div class="common-body-wrapper">
    <search-header single-width="130" :searchList="searchList" @changeHeight="toRetTable" @confirmSearch="toSearch"></search-header>
    <div class="common-table-tree-wrapper">
      <!-- <table-tree :isNeedTree="isNeedTree" @toggleTreeBox="toggleTreeBox" @setSelectedNode="setSelectedNode" @searchFn="getList">
      </table-tree> -->

      <div class="common-table-wrapper">
        <multi-fun-table :sortColumn='notFormatColumn' :orderType='sortType' :fixed-cols="fixedCols" :is-reset-table="isResetTable" :theads-info="theadsInfo" :tbodys-info="tbodysInfo" @handleMultiCheck="handleMultiCheck" @handleSortColumn="handleSortColumn" @searchFn="getList" @getNextPage="getNextPage"> <!--暂时不需要停车场树，因为车辆在运营商维度下的 :isNeedTree="isNeedTree" @toggleTreeBox="toggleTreeBox" -->
          <div class="operate-btn-group" slot="operateBtnGroup">
            <a class="ake_btn ake_btn_text" v-if="isPermmited('PARKVIP:PARK_CUSTOMER:SAVE')" @click.prevent="traderModal_open()">新增</a>
            <!-- <a class="ake_btn ake_btn_text" v-if="isPermmited('PARKVIP:PARK_CUSTOMER:IMPORT')" @click.prevent="importData()">导入</a> -->
            <a class="ake_btn ake_btn_text" v-if="isPermmited('PARKVIP:PARK_CUSTOMER:EXPORT')" @click.prevent="exportData()">导出</a>
          </div>
          <template slot="tdCell" slot-scope="props">
            <el-table-column :fixed="props.fixed" :label="props.label" :min-width="props.minWidth" :width="props.width" :prop="props.prop" :sortable="props.sortable">
              <template slot-scope="scope">
                <span v-if="'reno' == props.prop">{{scope.$index+1}}</span>                
                <span v-else>{{ scope.row[props.prop] }}</span>
              </template>
            </el-table-column>
          </template>

          <!--操作列内的按钮-->
          <template slot="operateCell" slot-scope="props">
            <el-table-column :fixed="props.fixed" :label="props.label" min-width="100">
              <template slot-scope="scope">
                <el-button size="small" type="primary" class="ake_btn ake_font_btn ake_btn_text" icon="el-icon-edit" v-if="isPermmited('PARKVIP:PARK_CUSTOMER:SAVE')" @click="traderModal_edit(scope.row)" plain></el-button>
                <el-button size="small" type="primary" class="ake_btn ake_font_btn ake_btn_red" icon="el-icon-delete" v-if="isPermmited('PARKVIP:PARK_CUSTOMER:DEL')" @click="deleteTrader(scope.row)" plain></el-button>
              </template>
            </el-table-column>
          </template>
        </multi-fun-table>

        <table-pagination :size="total" :cur-page="pageNumber" @backData="getPagination"></table-pagination>
      </div>
    </div>

    <!--modal-->
    <!--至少选择一项  modal-->
    <basic-modal ref="voidTipModal" bodyTxt="请至少选择一项">
      <h3 slot="title">温馨提示</h3>
      <div class="modal-footer" slot="modal-footer">
        <button class="ake_btn ake_btn_text modal-close" @click="closed('voidTipModal')">关闭</button>
      </div>
    </basic-modal>
    <!--导入-->
    <basic-modal ref="importModal" width="600" customeClass="import-modal" static="true">
      <h3 slot="title">批量导入车主信息</h3>
      <div class="modal-body" slot="modal-body">
        <el-form ref="importForm" :model="importFile" :rules="importRules" label-position="left" label-width="160px">
          <el-form-item label="下载模板">
            <a style="color: rebeccapurple;" class="text-btn ake-text-btn" href="javascript:;" @click="downloadTmp()">批量导入车主信息模板.xls</a>
          </el-form-item>
  
          <el-form-item label="选择文件" prop="importFile">
            <input type="file" @change="getFile($event)" class="first-item file-input">
            <p class="help-block">支持.xls格式，大小不超过2.0M</p>
          </el-form-item>
  
          <el-form-item v-if="importResult && importResult.processedCount!=importResult.totalCount" label="导入结果">
            <span v-if="importResult.processedCount!=importResult.totalCount">共{{importResult.totalCount}}条记录，失败记录{{importResult.failCount}}条</span>
          </el-form-item>
  
          <el-form-item label="上次失败文件下载" v-if="importResult&&importResult.errorFileName">
            <a style="color: red;" class="text-btn ake-text-btn text-btn_red" @click="downloadError()" href="javascript:;" v-text="importResult.errorFileName"></a>
          </el-form-item>
  
          <div class="import-notice">
            <span class="">
              <h5>温馨提示：请按照以下步骤进行导入</h5>
              <p>1.请先下载模板文件，严格按照模板文件格式进行填写，不可更改文件格式.</p>
              <p>2.模板文件填写完成后，浏览选择文件，然后点击上传。</p>
              <p>3.如果上传失败，请下载失败文件，并注意失败原因的提示。重新填写上传。</p>
            </span>
          </div>
  
        </el-form>
      </div>
      <div class="modal-footer" slot="modal-footer">
        <button class="ake_btn ake_btn_text ake_btn_confirm" @click.stop="sureImport($event)">确认</button>
        <button class="ake_btn ake_btn_text modal-close" @click="closed('importModal')">取消</button>
      </div>
    </basic-modal>
  
    <!--新增车主-->
    <basic-modal ref="userModal" width="600" customeClass="trader-row-modal" static="true">
      <h3 slot="title">{{traderstatus== "new"?"新增车主":"编辑车主"}}</h3>
      <div class="modal-body ModalBody_edit" slot="modal-body">
        <div class="tradercss">
          <el-form ref="user_form" :model="traderModalData" :rules="traderRules" label-position="left" label-width="160px">
            <el-form-item prop="customerName" label="姓名">
              <el-input class="first-item" v-model="traderModalData.customerName"></el-input>
            </el-form-item>
            <el-form-item prop="customerSex" label="性别">
              <el-select class="first-item" v-model="traderModalData.customerSex">
                <el-option label="男" value="MALE"></el-option>
                <el-option label="女" value="FEMALE"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item prop="customerTelphone" label="电话">
              <el-input class="first-item" v-model="traderModalData.customerTelphone"></el-input>
            </el-form-item>
            <el-form-item prop="defaultCarLicense" label="车牌号码" v-if="carCodeListStr.length==0">
                <div class="flexBox">
                  <el-input class="first-item" value="" disabled="disabled"></el-input>
                  <a class="ake_btn ake_font_btn ake_btn_text" icon="add" v-if="isPermmited('PARK_CAR:PARK_CUSTOMER_CAR:SAVE')" @click="carModal_open()">+</a>
                  <el-button size="small" type="primary" v-if="traderstatus != 'new' & isPermmited('PARK_CAR:PARK_CUSTOMER_CAR:SAVE')" class="ake_btn ake_font_btn ake_btn_text" icon="el-icon-edit" @click.prevent="carCode_edit(0)"></el-button>
                  <el-button size="small" type="primary" v-if="traderstatus != 'new' & isPermmited('PARK_CAR:PARK_CUSTOMER_CAR:DEL')" class="ake_btn ake_font_btn ake_btn_text" icon="el-icon-delete" @click.prevent="carCode_del(0)"></el-button>
                </div>
              </el-form-item>
            <template v-for="(listItem,index) in carCodeListStr" v-else>
              <el-form-item prop="defaultCarLicense" :label="index==0?'车牌号码':' '" :key="index">
                <div class="flexBox">
                  <el-input class="first-item" :value="listItem" disabled="disabled"></el-input>
                  <a class="ake_btn ake_font_btn ake_btn_text" icon="add" v-if="showAddIcon==index" @click="carModal_open()">+</a>
                  <!-- <el-button size="small" type="primary" v-if="true" class="ake_btn ake_font_btn ake_btn_text" icon="el-icon-edit" @click.prevent="carModal_edit(traderModalData.defaultCarLicense)"></el-button> -->
                  <el-button size="small" type="primary" v-if="true" class="ake_btn ake_font_btn ake_btn_text" icon="el-icon-edit" @click.prevent="carCode_edit(index)"></el-button>
                  <!-- <el-button size="small" type="primary" v-if="true" class="ake_btn ake_font_btn ake_btn_text" icon="el-icon-delete" @click.prevent="carModal_del(scope.row)"></el-button> -->
                  <el-button size="small" type="primary" v-if="true" class="ake_btn ake_font_btn ake_btn_text" icon="el-icon-delete" @click.prevent="carCode_del(index)"></el-button>
                </div>
              </el-form-item>
            </template>
            <el-form-item prop="customerCompany" label="公司名称">
              <el-input class="first-item" v-model="traderModalData.customerCompany"></el-input>
            </el-form-item>
            <el-form-item prop="customerDepartment" label="部门">
              <el-input class="first-item" v-model="traderModalData.customerDepartment"></el-input>
            </el-form-item>
            <el-form-item prop="customerAddress" label="地址">
              <el-input class="first-item" v-model="traderModalData.customerAddress"></el-input>
            </el-form-item>
            <el-form-item prop="customerRoomNumber" label="房间号">
              <el-input class="first-item" v-model="traderModalData.customerRoomNumber"></el-input>
            </el-form-item>
            <el-form-item prop="identityCardNumber" label="身份证号">
              <el-input class="first-item" v-model="traderModalData.identityCardNumber"></el-input>
            </el-form-item>
            
            <el-form-item prop="identityCardImg" label="身份证图片">
              <!-- <el-input type="file" class="first-item file-input" id='traderpic' name="traderpic" v-model="traderModalData.pic"></el-input> -->
              <input type="file" class="first-item file-input" id='traderpic' name="traderpic"></input>
              <img v-if="traderModalData.identityCardImg" :src="traderModalData.identityCardImg" class="ticket-pic" alt="">
            </el-form-item>
            <el-form-item prop="remark1" label="备注1">
              <el-input class="first-item" type="textarea" v-model="traderModalData.remark1"></el-input>
            </el-form-item>
            
            <el-form-item prop="remark2" label="备注2">
              <el-input class="first-item" type="textarea" v-model="traderModalData.remark2"></el-input>
            </el-form-item>
            <el-form-item prop="remark3" label="备注3">
              <el-input class="first-item" type="textarea" v-model="traderModalData.remark3"></el-input>
            </el-form-item>
          </el-form>
        </div>
      </div>
      <div class="modal-footer" slot="modal-footer">
        <button class="ake_btn ake_btn_text ake_btn_confirm" @click.stop="traderModal_save()">确认</button>
        <button class="ake_btn ake_btn_text modal-close" @click="closed('userModal')">取消</button>
      </div>
    </basic-modal>

    <!--新增车牌-->
    <basic-modal ref="carModal" width="600" customeClass="trader-row-modal" static="true">
      <h3 slot="title">{{carstatus== "new"?"新增车牌":"编辑车牌"}}</h3>
      <div class="modal-body ModalBody_edit" slot="modal-body">
        <div class="tradercss">
          <el-form ref="car_form" :model="carModalData" :rules="carRules" label-position="left" label-width="160px">
            <el-form-item prop="carLicenseNumber" label="车牌号码">
              <el-input class="first-item" v-model="carModalData.carLicenseNumber"></el-input>
            </el-form-item>
            <el-form-item prop="customerName" label="卡号">
              <el-input class="first-item" v-model="carModalData.carCardNumber"></el-input>
            </el-form-item>
            <el-form-item prop="carLogo" label="车辆品牌">
              <el-select class="first-item" v-model="carModalData.carLogo">
                <el-option label="雪佛兰" value="CHEVROLET"></el-option>
                <el-option label="日产" value="NISSAN"></el-option>
                <el-option label="福特" value="FORD"></el-option>
                <el-option label="本田" value="HONDA"></el-option>
                <el-option label="丰田" value="TOYOTA"></el-option>
                <el-option label="别克" value="BUICK"></el-option>
                <el-option label="现代" value="HYUNDAI"></el-option>
                <el-option label="吉利" value="JI_LI"></el-option>
                <el-option label="起亚" value="KIA"></el-option>
                <el-option label="斯柯达" value="SKODA"></el-option>
                <el-option label="比亚迪" value="BYD"></el-option>
                <el-option label="奥迪" value="AUDI"></el-option>
                <el-option label="雪铁龙" value="CITROEN"></el-option>
                <el-option label="荣威" value="RONG_WEI"></el-option>
                <el-option label="奇瑞" value="QI_RUI"></el-option>
                <el-option label="宝马" value="BMW"></el-option>
                <el-option label="长安" value="CHANG_AN"></el-option>
                <el-option label="铃木" value="SUZUKI"></el-option>
                <el-option label="马自达" value="MAZDA"></el-option>
                <el-option label="传祺" value="CHUAN_QI"></el-option>
                <el-option label="海马" value="HAI_MA"></el-option>
                <el-option label="奔腾" value="BEN_TENG"></el-option>
                <el-option label="标志" value="PEUGEOT"></el-option>
                <el-option label="绅宝" value="SAAB"></el-option>
                <el-option label="凯晨" value="KAI_CHEN"></el-option>
                <el-option label="奔驰" value="BENZ"></el-option>
                <el-option label="菲亚特" value="FIAT"></el-option>
                <el-option label="青年莲花" value="QING_NIAN_LIAN_HUA"></el-option>
                <el-option label="凯迪拉克" value="CADILLAC"></el-option>
                <el-option label="东南" value="DONG_NAN"></el-option>
                <el-option label="长城" value="CHANG_CHENG"></el-option>
                <el-option label="宝骏" value="BAO_JUN"></el-option>
                <el-option label="众泰" value="ZHONG_TAI"></el-option>
                <el-option label="夏利" value="XIA_LI"></el-option>
                <el-option label="东风风神" value="DONG_FENG_FENG_SHEN"></el-option>
                <el-option label="华泰" value="HUA_TAI"></el-option>
                <el-option label="北京汽车" value="BEI_JING"></el-option>
                <el-option label="其他" value="OTHER"></el-option>
                <el-option label="未知" value="UNKNOWN"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item prop="carColor" label="车辆颜色">
              <el-select class="first-item" v-model="carModalData.carColor">
                <el-option label="白色" value="WHITE"></el-option>
                <el-option label="黑色" value="BLACK"></el-option>
                <el-option label="红色" value="RED"></el-option>
                <el-option label="绿色" value="GREEN"></el-option>
                <el-option label="粉色" value="PINK"></el-option>
                <el-option label="蓝色" value="BLUE"></el-option>
                <el-option label="紫色" value="PURPLE"></el-option>
                <el-option label="灰色" value="GRAY"></el-option>
                <el-option label="雪青色" value="LILAC"></el-option>
                <el-option label="葱绿色" value="LIGHT_GREEN"></el-option>
                <el-option label="黄色" value="YELLOW"></el-option>
                <el-option label="橘色" value="ORANGE"></el-option>
                <el-option label="其他" value="OTHER"></el-option>
                <el-option label="未知" value="UNKNOWN"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item prop="carOwnType" label="公私车">
              <el-select class="first-item" v-model="carModalData.carOwnType">
                <el-option label="公车" value="PUBLIC_CAR"></el-option>
                <el-option label="私车" value="PRIVATE_CAR"></el-option>
                <el-option label="未知" value="UNKNOWN"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item prop="carModel" label="车辆型号">
              <el-input class="first-item" v-model="carModalData.carModel"></el-input>
            </el-form-item>
            <el-form-item prop="carSizeType" label="车辆类型">
              <el-select class="first-item" v-model="carModalData.carSizeType">
                <el-option label="微型客车" value="MINI_CAR"></el-option>
                <el-option label="小型客车" value="SMALL_CAR"></el-option>
                <el-option label="中型客车" value="MEDIUM_CAR"></el-option>
                <el-option label="大型客车" value="LARGE_CAR"></el-option>
                <el-option label="微型货车" value="MINI_TRUCK"></el-option>
                <el-option label="轻型货车" value="SMALL_TRUCK"></el-option>
                <el-option label="中型货车" value="MEDIUM_TRUCK"></el-option>
                <el-option label="重型货车" value="HEAVY_TRUCK"></el-option>
                <el-option label="三轮汽车" value="TH_WHEEL_VEHICLE"></el-option>
                <el-option label="低速货车" value="LOW_SPEED_TRUCK"></el-option>
                <el-option label="摩托车" value="MOTOR_CYCLE"></el-option>
                <el-option label="轻型挂车" value="LIGHT_TRAILER"></el-option>
                <el-option label="中型挂车" value="MEDIUM_TRAILER"></el-option>
                <el-option label="重型挂车" value="HEAVY_TRAILER"></el-option>
                <el-option label="未知" value="UNKNOWN"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item prop="drivingLicensePicture" label="行驶证照片" v-if="carstatus== 'new'">
                <input type="file" class="first-item file-input" id='carpic' name="carpic"></input>
                <img v-if="tempPic.drivingLicensePicture" :src="tempPic.drivingLicensePicture" class="ticket-pic" alt="">
              </el-form-item>
            <template v-for="(listItem,index) in carCodeListArr" v-if="carstatus != 'new'">
              <el-form-item v-if="index==editNum" prop="drivingLicensePicture" label="行驶证照片">
                <input type="file" class="first-item file-input" id='carpic' name="carpic"></input>
                <img v-if="listItem.drivingLicensePicture" :src="listItem.drivingLicensePicture" class="ticket-pic" alt="">
              </el-form-item> 
            </template>           
          </el-form>
        </div>
      </div>
      <div class="modal-footer" slot="modal-footer">
         <button class="ake_btn ake_btn_text ake_btn_confirm" @click.stop="carModal_save()">确认</button>
        <button class="ake_btn ake_btn_text modal-close" @click="closed('carModal')">取消</button>
      </div>
    </basic-modal>

  </div>
</template>

<script>
import common from "@mixins/common.js";
import stardardList from "@mixins/tables/stardardList.js";

//modal
import invokeModal from "@mixins/modal/invokeModal.js";
import BigPicModal from "@components/widgets/BigPicModal.vue";

// image
import images from "@mixins/image.js";

// 引进vue的js
import park_customer from "./js/park_customer.js";
export default {
  mixins: [
    common,
    stardardList,
    invokeModal,
    images,
    park_customer
  ],
  components: {
    BigPicModal
  },
  data() {
    const today = [
      new Date(moment().format("YYYY-MM-DD 00:00:00")),
      new Date(moment().format("YYYY-MM-DD 23:59:59"))
    ];

    var telephone = (rule, value, callback) => {
      if (!value) {
        return callback(new Error("请输入电话号码"));
      }
      // setTimeout(() => {
      if (!/^1[34578]\d{9}$/.test(value)) {
        callback(new Error("请输入正确的电话号码"));
      } else {
        callback();
      }
      // }, 500);
    };
    var checkDuplicatedName = (rule, value, callback) => {
      //检查是否重复名称
      API.park.checkDuplicatedName({ name: value }).then(
        res => {
          if (res.valid) {
            callback();
          } else {
            callback(new Error("此名称已被占用"));
          }
        },
        err => {}
      );
    };
    //检查车牌是否重复
    var checkCarNoDuplicatedName = (rule, value, callback) => {
      //检查是否重复名称
      API.park.checkCarNoDuplicatedName({ name: value }).then(
        res => {
          if (res.valid) {
            callback();
          } else {
            callback(new Error("此名称已被占用"));
          }
        },
        err => {}
      );
    };
    //校验车牌
    var checkCarNum = (rule, value, callback)=> {
      if (!value) {
        return callback(new Error('请输入车牌号码'));
      }
      if (!(/^([冀豫云辽黑湘皖鲁苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼渝京津沪新京军空海北沈兰济南广成使领][a-zA-Z](([DF](?![a-zA-Z0-9]*[IO])[0-9]{4})|([0-9]{5}[DF])))|([冀豫云辽黑湘皖鲁苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼渝京津沪新京军空海北沈兰济南广成使领A-Z]{1}[a-zA-Z0-9]{5}[a-zA-Z0-9挂学警港澳]{1})|民航[a-zA-Z0-9]{5}$/.test(value))) {
        callback(new Error('请输入正确的车牌号码'));
      } else {
        callback();
      }
    };

    return {
      fixedCols: 3,
      total: 0,

      traderstatus: "new",
      traderpic: "",

      drivingLicensePic: "",
      carstatus: "new",
      //导入
      importResult: "",
      importFile: {
        importFile: ""
      },
      importRules: {},
      //新增 编辑停车场用户的参数
      traderModalData: {
        id: null,
        customerName: "",
        customerSex: "",
        customerTelphone: "",
        defaultCarLicense: "",
        customerCompany: "",
        customerDepartment: "",
        customerAddress: "",
        customerRoomNumber: "",
        identityCardNumber: "",
        identityCardImg: "",
        remark1: "",
        remark2: "",
        remark3: "",
        identityCardImgPic: "",
        carConfigList1: [],
      },
      traderRules: {
        customerName: [
          { required: true, message: "请输入用户名称", trigger: "change" },
          { min: 2, max: 15, message: "长度在 2 到 15 个字符", trigger: "change" },
         // { validator: checkDuplicatedName, trigger: "blur" }
        ],
        customerTelphone: [
          { required: true, validator: telephone, trigger: "change" }
        ],
        defaultCarLicense: [
          { required: true, message: "车牌号码不能为空", trigger: "change" },
        ]
      },
      //新增车主弹框新增车牌号码列表
      carCodeListStr: [],
      //新增车主弹框新增车牌号码列表
      carCodeListArr: [],
      //新增 编辑用户车辆的参数
      carModalData: {
        id: null,
        parkCustomerId: "",
        carLicenseNumber: "",
        carCardNumber: "",
        carOwnType: "",
        carLogo: "",
        carColor: "",
        carModel: "",
        carSizeType: "",
        drivingLicensePicture: "",
        drivingLicensePic: ""
      },
      //临时保存车辆行驶证图片信息
      tempPic:{
        drivingLicensePicture: "",
        drivingLicensePic: "",
      },
      //编辑车牌时暂存所在数组位置号码
      editNum: "",
      carRules: {
        carLicenseNumber: [
          { required: true, message: "请输入车牌号码", trigger: "change" },
          { min: 2, max: 15, message: "长度在 6 到 9 个字符", trigger: "change" },
          { validator: checkCarNum, trigger: "blur" },
          { validator: checkCarNoDuplicatedName, trigger: "blur" }
        ]
      },

      //prop-返回数据的字段名称   proisNotInter:true,pNameisNotInter:true,，name-查询字段传参名称    text-显示名称  //initHidden  初始化不显示
      searchList: [
        {
          type: "text",
          isShow: false,
          name: "customerName",
          text: "姓名",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "customerTelphone",
          text: "电话",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "carLicenseNumber",
          text: "车牌号",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "carCardNumber",
          text: "卡号",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "customerCompany",
          text: "公司",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "customerDepartment",
          text: "部门",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "customerAddress",
          text: "地址",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "customerRoomNumber",
          text: "房间",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "identityCardNumber",
          text: "身份证",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "remark1",
          text: "备注1",
          value: ""
        },
        {
          type: "text",
          isShow: false,
          name: "remark2",
          text: "备注2",
          value: ""
        },
        { type: "text", isShow: false, name: "remark3", text: "备注3", value: "" }
      ],
      theadsInfo: [
        // { index: 0, isShow: false, prop: "reno", text: "序号", width: 64 },
        {
          index: 1,
          isShow: false,
          prop: "customerName",
          text: "姓名",
          sortable: true,
          minWidth: 100
        },
        {
          index: 1,
          isShow: false,
          prop: "carLicenseNumber",
          text: "车牌号",
          sortable: true,
          minWidth: 200
        },
        {
          index: 2,
          isShow: false,
          prop: "carCardNumber",
          text: "卡号",
          sortable: true,
          minWidth: 140
        },
        {
          index: 3,
          isShow: false,
          prop: "customerTelphone",
          text: "电话",
          sortable: true,
          minWidth: 140
        },
        {
          index: 4,
          isShow: false,
          prop: "customerSexStr",
          text: "性别",
          sortable: true,
          minWidth: 90
        },
        {
          index: 5,
          isShow: false,
          prop: "customerCompany",
          text: "公司名称",
          sortable: true,
          minWidth: 120
        },
        {
          index: 6,
          isShow: false,
          prop: "customerDepartment",
          text: "部门",
          sortable: true,
          minWidth: 120
        },
        {
          index: 6,
          isShow: false,
          prop: "customerAddress",
          text: "地址",
          sortable: true,
          minWidth: 120
        },
        {
          index: 7,
          isShow: false,
          prop: "customerRoomNumber",
          text: "房间号",
          sortable: true,
          minWidth: 120
        },
        {
          index: 7,
          isShow: false,
          prop: "identityCardNumber",
          text: "身份证号",
          sortable: true,
          minWidth: 120
        },
        {
          index: 7,
          isShow: false,
          prop: "remark1",
          text: "备注1",
          sortable: true,
          minWidth: 120
        },
        {
          index: 7,
          isShow: false,
          prop: "remark2",
          text: "备注2",
          sortable: true,
          minWidth: 120
        },
        {
          index: 7,
          isShow: false,
          prop: "remark3",
          text: "备注3",
          sortable: true,
          minWidth: 120
        },
        {
          index: 8,
          isShow: false,
          prop: "modifyBy",
          text: "最近操作员",
          sortable: true,
          minWidth: 160
        },
        {
          index: 9,
          isShow: false,
          prop: "modifyTime",
          text: "最近操作时间",
          sortable: true,
          minWidth: 200
        }
      ],
      tbodysInfo: []
    };
  },
  methods: {}
};
</script>

<style lang="less" scoped>
.flexBox {
  display: flex;
  align-items: center;
  & > a,
  & > button,
  & > div {
    margin: 0 5px 0 0;
    margin-right: 5px;
  }
}
</style>